<!DOCTYPE html>
<html lang="zh-Hans">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Part 2：CSS 基础</title>
</head>

<body>
    <h1>P2 演示源码</h1>

    <h2>课程章节演示</h2>

    <ul>
        <li>认识CSS <a href="./basic.html">(basic.html)</a></li>
        <li>HTML中引入CSS <a href="./css-link/index.html">(css-link/index.html)</a></li>
        <li>CSS调试 <a href="./debug.html">(debug.html)</a></li>
        <li>伪类选择器 <ul>
                <li>状态伪类<a href="./link.html">(link.html)</a></li>
                <li>结构伪类<a href="./nth-child.html">(nth-child.html)</a></li>
            </ul>
        </li>
        <li>关系选择器 <a href="./selector-brother.html">(selector-brother.html)</a></li>
        <li>伪元素选择器 <a href="./selector-pseudo-element.html">(selector-pseudo-element.html)</a></li>
        <li>属性和值 <a href="./attribute.html">(attribute.html)</a></li>
        <li>单位 <a href="./cssunit.html">(cssunit.html)</a></li>
        <li>颜色 <a href="./color.html">(color.html)</a></li>
        <li>盒模型 <a href="./box.html">(box.html)</a></li>
        <li>盒模型相关属性详解 <a href="./box-property.html">(box-property.html)</a></li>
        <li>元素的显示隐藏 <a href="./show.html">(show.html)</a></li>
        <li>背景 <a href="./bg/bg.html">(bg/bg.html)</a></li>
        <li>雪碧图 <a href="./sprite.html">(sprite.html)</a></li>
        <li>渐变背景-线性 <a href="./gradient-linear.html">(gradient-linear.html)</a></li>
        <li>渐变背景-径向 <a href="./gradient-radial.html">(gradient-radial.html)</a></li>
        <li>样式的继承与层叠 <ul>
                <li>浏览器默认样式 <a href="./style-useragent.html">(style-useragent.html)</a></li>
                <li>样式的继承 <a href="./style-inherit.html">(style-inherit.html)</a></li>
                <li>样式的层叠 <a href="./style-stack.html">(style-stack.html)</a></li>
            </ul>
        </li>
        <li>样式优先级 <a href="./gradient-radial.html">(gradient-radial.html)</a></li>
    </ul>

    <h2>练习示例</h2>

    <ul>
        <li>切换元素显示 <a href="./hover-tips-demo.html">hover-tips-demo.html</a></li>
        <li>创建表格 <a href="./table.html"><del>table.html 这里的链接文件不存在，需要更新</del></a></li>
    </ul>

    <h2>其他</h2>

    <ul>
        <li>外边距相关<ul>
                <li>margin <a href="./margin.html">margin.html</a> </li>
                <li>负margin <a href="./margin-negative.html">margin-negative.html</a> </li>
            </ul>
        </li>
    </ul>
</body>

</html>